{% extends 'base.html' %}

{% block styles %}
  {{ super() }}
  <link href="{{ url_for_static('static', filename='plugins/bootstrap-table/bootstrap-table.min.css') }}" rel="stylesheet">
  <link href="{{ url_for_static('static', filename='plugins/bootstrap-table/extensions/reorder-rows/bootstrap-table-reorder-rows.min.css') }}" rel="stylesheet">
  <link href="{{ url_for_static('static', filename='css/module/module.css') }}" rel="stylesheet">
{% endblock styles %}

{% block body_attribs %}
class="bg-gradient-grey"
{% endblock body_attribs %}

{% block app_content %}
<div class="card shadow container-fluid mt-5">
  <div class="card-body card-body-module-list">
    <input type="text" class="form-control" id="input-project-id" value="{{ project.id if project }}" placeholder="" disabled style="display: none">
    <div class="row pt-2">
      <h4 class="col-6">{{ project.name if project }} 模块列表</h4>
      <div class="col-6 d-flex justify-content-end">
        <div class="btn-group" role="group">
          <button type="button" class="btn btn-outline-success" id="btn-start-project-test" disabled="">执行测试</button>
          <button type="button" class="btn btn-outline-danger" id="btn-stop-project-test" disabled="">终止测试</button>
        </div>
      </div>
    </div>
    <div class="btn-toolbar" role="toolbar" id="table-module-toolbar">
      <div class="btn-group mr-2" role="group">
        <button type="button" class="btn btn-primary" id="btn-add-module">新增</button>
      </div>
    </div>
    <table id="table-module-list"></table>
  </div>
</div>

<div class="modal fade" id="modal-add-module" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">新增测试模块</h5>
        <button type="button" class="close" data-dismiss="modal">
          <span>&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <div class="form-group">
          <label for="input-add-module-name">模块名称</label>
          <input type="text" class="form-control" id="input-add-module-name" placeholder="输入模块名称">
        </div>
        <div class="form-group">
          <label for="input-add-module-description">模块描述</label>
          <input type="text" class="form-control" id="input-add-module-description" placeholder="输入模块描述">
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
        <button id="btn-save-add-module" type="button" class="btn btn-primary">确定</button>
      </div>
    </div>
  </div>
</div>

<div class="modal fade" id="modal-modify-module" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-dialog-centered" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">修改测试模块</h5>
        <button type="button" class="close" data-dismiss="modal">
          <span>&times;</span>
        </button>
      </div>
      <div class="modal-body">
        <input type="text" class="form-control" id="input-add-module-id" disabled style="display: none"/>
        <div class="form-group">
          <label for="input-modify-module-name">模块名称</label>
          <input type="text" class="form-control" id="input-modify-module-name" placeholder="输入模块名称">
        </div>
        <div class="form-group">
          <label for="input-modify-module-description">模块描述</label>
          <input type="text" class="form-control" id="input-modify-module-description" placeholder="输入模块描述">
        </div>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">关闭</button>
        <button id="btn-save-modify-module" type="button" class="btn btn-primary">确定</button>
      </div>
    </div>
  </div>
</div>
{% endblock %}


{% block scripts %}
  {{ super() }}
  <script src="{{ url_for_static('static', filename='plugins/bootstrap-table/bootstrap-table.min.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/TableDnD/jquery.tablednd.min.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/bootstrap-table/extensions/reorder-rows/bootstrap-table-reorder-rows.min.js') }}"></script>
  <script src="{{ url_for_static('static', filename='plugins/bootstrap-table/locale/bootstrap-table-zh-CN.js') }}"></script>
  <script src="{{ url_for_static('static', filename='js/module/module.js') }}"></script>
{% endblock %}